﻿<script src="~/vue/dist/vue.global.js"></script>
<link href="~/element-plus/dist/index.css" rel="stylesheet" />
<script src="~/element-plus/dist/index.full.js"></script>
<script src="~/axios/dist/axios.js"></script>
<html>
<head>
    <link href="~/css/table.css" rel="stylesheet" />
    <title>无标题文档</title>
</head>
<body>
    <div id="app">
        <table width="100%">
            <tr>
                <td>
                    <font color="black">
                        您正在做的业务是：人力资源--薪酬标准管理--薪酬标准登记查询
                    </font>
                </td>
            </tr>
            <tr>
                <td align="right">
                    @* <el-button v-on:click="add()">复核通过</el-button> *@
                    <el-button v-on:click="reset()">返回</el-button>
                </td>
            </tr>
        </table>
        <table id="stable" width="100%" border="1" cellpadding=0 cellspacing=1
               bordercolorlight=#848284 bordercolordark=#eeeeee
               class="TABLE_STYLE1">
            <tr>
                <td width="74" class="TD_STYLE1">
                    薪酬标准编号
                </td>
                <td width="168" class="TD_STYLE2">
                    <el-input v-model="ruleForm.standardId" class="INPUT_STYLE2" readonly />
                </td>
                <td width="83" class="TD_STYLE1">
                    薪酬标准名称
                </td>
                <td width="171" class="TD_STYLE2">
                    <el-input v-model="ruleForm.standardName" class="INPUT_STYLE2" readonly />
                </td>
                <td width="170" class="TD_STYLE1">
                    薪酬总额
                </td>
                <td width="138" class="TD_STYLE2">
                    <el-input v-model="ruleForm.salarySum" class="INPUT_STYLE2" readonly />
                </td>
            </tr>
            <tr>
                <td class="TD_STYLE1">
                    制定人
                </td>
                <td class="TD_STYLE2">
                    <el-input v-model="ruleForm.designer" class="INPUT_STYLE2" readonly />
                </td>
                <td class="TD_STYLE1">
                    复核人
                </td>
                <td class="TD_STYLE2">
                    <el-input v-model="ruleForm.checker" class="INPUT_STYLE2" readonly />
                </td>
                <td class="TD_STYLE1">
                    复核时间
                </td>
                <td class="TD_STYLE2">
                    <el-input v-model="ruleForm.checkTime" class="INPUT_STYLE2" readonly />
                </td>
            </tr>
            <tr>
                <td class="TD_STYLE1">
                    复核意见
                </td>
                <td colspan="7" class="TD_STYLE2">
                    <el-input v-model="ruleForm.checkComment"
                              :rows="4"
                              type="textarea" class="TEXTAREA_STYLE1" style="width: 80%" readonly />
                </td>
            </tr>

            <tbody>
                <tr class="TD_STYLE1">
                    <td align="center">
                        序号
                    </td>
                    <td colspan="3">
                        薪酬项目名称
                    </td>
                    <td>
                        金额
                    </td>
                    <td colspan="3">
                        &nbsp;
                    </td>
                <tr class="TD_STYLE2" v-for="(ss,index) in ruleForm.list" style=" border: 1px solid #000;">
                    <td align="center">
                        {{ss.itemId}}
                        <input type="hidden" name="details[0].itemId" value="63">
                    </td>
                    <td colspan="3">
                        {{ss.itemName}}
                    </td>
                    <td>
                        <el-input v-model="ss.salary" class="INPUT_STYLE2" readonly />
                    </td>
                    <td colspan="3">
                        &nbsp;
                    </td>
                </tr>
            </tbody>
        </table>
        <p>
            &nbsp;
        </p>
    </div>
</body>
</html>
<script lang="ts" setup>
    window.userTrueName = '@ViewBag.UserTrueName'; // 将ViewBag的值赋给全局变量，方便Vue实例获取
    const { createApp, ref, reactive, computed, watchEffect} = Vue
    const { ElMessage } = ElementPlus
    var app = createApp({
        setup() {
            const ruleForm = reactive({
                ssdId:"",//薪酬标准主键
                standardId:"",//薪酬标准单号
                standardName:"",//薪酬标准名称
                designer:"",//制定人
                checker:"",//复核人
                checkTime:"",//复核时间
                salarySum:0.00,//薪酬总额
                checkComment:"",//复核意见
                list:[]
            })


            function SSSelectById(){
                axios.get("/SS/SSSelectBySsdId").then(res =>{
                    ruleForm.standardId = res.data.standardId
                    ruleForm.standardName = res.data.standardName
                    ruleForm.salarySum = res.data.salarySum
                    ruleForm.checker = res.data.checker
                    ruleForm.designer = res.data.designer
                    ruleForm.ssdId = res.data.ssdId
                    ruleForm.checkTime = res.data.checkTime
                    ruleForm.checkComment = res.data.checkComment
                    axios.get("/SS/SSDSelectBySid",{
                        params:{
                            sid :ruleForm.standardId
                        }
                    }).then(res =>{
                        ruleForm.list = res.data
                    }).catch(error =>{
                        console.info(error)
                    })
                }).catch(error =>{
                    console.info(error)
                })
            }
            SSSelectById()

            function reset(){
                // window.location.href = "/SS/SSSelect"
                window.history.back();
            }

            return {
                ruleForm,reset
            }
        }
    })
    app.use(ElementPlus)
    app.mount("#app");
</script>
<style>
    body {
        background-color: #ffffcc;
    }

    .el-form-item__content {
        margin-left: 0px !important;
    }

    .el-form-item__error {
        color: var(--el-color-danger);
        font-size: 12px;
        left: 0;
        line-height: 1;
        padding-top: 2px;
        position: static !important;
        margin-left: 10px;
        top: 100%;
    }

    .el-form-item {
        display: flex;
        --font-size: 14px;
        margin-bottom: 0px !important;
    }

    tr .TD_STYLE2 {
        height: 46px
    }

    .btn {
        height: 25px;
        margin-top: -8px;
    }

</style>